<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout">
<head th:fragment="headerFragment(title,active)">
    <meta charset="utf-8"/>
    <title><th:block th:text="${title != null ? title : ''} + ' Mr.Du'"></th:block></title>
    <meta name="baidu-site-verification" content="f3pd3lmpkj"/>
    <meta property="wb:webmaster" content="b0059bf0e1f39b05"/>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
    <link href="https://cdn.jsdelivr.net/fancybox/2.1.5/jquery.fancybox.min.css" rel="stylesheet" type="text/css"/>
    <link href="https://fonts.googleapis.com/css?family=Monda:300,300italic,400,400italic,700,700italic|Roboto Slab:300,300italic,400,400italic,700,700italic|Rosario:300,300italic,400,400italic,700,700italic|PT Mono:300,300italic,400,400italic,700,700italic&amp;subset=latin,latin-ext" rel="stylesheet" type="text/css"/>
    <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.2/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
    <link th:href="@{/blog/css/main.css}" rel="stylesheet" type="text/css"/>
    <meta name="keywords" content="KyrieCao"/>
    <link rel="shortcut icon" type="image/x-icon" th:href="@{/blog/image/favicon.ico}"/>
    <meta name="description" content="Trust yourself！"/>
    <script type="text/javascript">
        var CLUAS = window.CLUAS || {};
        var CONFIG = {
            root: '/',
            scheme: 'Pisces',
            sidebar: {
                "position": "left",
                "display": "post",
                "offset": 12,
                "offset_float": 0,
                "b2t": false,
                "scrollpercent": true
            },
            fancybox: true,
            motion: true,
            algolia: {
                applicationID: '{{ algolia.appID }}',
                apiKey: '{{algolia.searchKey}}',
                indexName: '{{algolia.indexName }}',
                hits: {"per_page": 7},
                labels: {
                    "input_placeholder": "搜索",
                    "hits_empty": "未发现与 「${query}」相关的内容",
                    "hits_stats": "${hits} 条相关条目，使用了 ${time} 毫秒"
                }
            }
        };
    </script>
</head>
<body>

    <div class="container sidebar-position-left page-home">
        <div class="headband"></div>
        <div th:replace="blog/fragments/header::header"></div>
        <main id="main" class="main">
            <div class="main-inner">

                <!--主体content-->
                <div layout:fragment="content" id="content"></div>

                <!--侧边栏-->
                <div class="sidebar-toggle">
                    <div class="sidebar-toggle-line-wrap">
                        <span class="sidebar-toggle-line sidebar-toggle-line-first"></span>
                        <span class="sidebar-toggle-line sidebar-toggle-line-middle"></span>
                        <span class="sidebar-toggle-line sidebar-toggle-line-last"></span>
                    </div>
                </div>
                <div th:replace="blog/fragments/sidebar::sidebar"></div>

            </div>
        </main>
        <!--底部footer-->
        <div th:replace="blog/fragments/footer::footer(${commons.site_record()})"></div>

        <div class="back-to-top">
            <i class="fa fa-arrow-up"></i> <span id="scrollpercent"><span>0</span>%</span>
        </div>
    </div>

    <script type="text/javascript">
        if (Object.prototype.toString.call(window.Promise) !== '[object Function]') {
            window.Promise = null;
        }
    </script>
    <script type="text/javascript" src="https://cdn.jsdelivr.net/jquery/2.1.3/jquery.min.js"></script>
    <script type="text/javascript" src="https://cdn.jsdelivr.net/fastclick/1.0.6/fastclick.min.js"></script>
    <script type="text/javascript" th:src="@{/blog/jquery.lazyload/1.9.3/jquery.lazyload.min.js}"></script>
    <script type="text/javascript" th:src="@{/blog/velocity/1.2.3/velocity.min.js}"></script>
    <script type="text/javascript" th:src="@{/blog/velocity/1.2.3/velocity.ui.min.js}"></script>
    <script type="text/javascript" th:src="@{/blog/fancybox/2.1.5/jquery.fancybox.pack.js}"></script>
    <script type="text/javascript" th:src="@{/blog/js/src/utils.js}"></script>
    <script type="text/javascript" th:src="@{/blog/js/src/motion.js}"></script>
    <script type="text/javascript" th:src="@{/blog/js/src/affix.js}"></script>
    <script type="text/javascript" th:src="@{/blog/js/schemes/pisces.js}"></script>
    <script type="text/javascript" th:src="@{/blog/js/src/scrollspy.js}"></script>
    <script type="text/javascript" th:src="@{/blog/js/src/post-details.js}"></script>
    <script type="text/javascript" th:src="@{/blog/js/src/bootstrap.js}"></script>
    <script type="text/javascript" th:src="@{/blog/js/src/algolia-search.js}"></script>
    <link rel="stylesheet" th:href="@{/blog/lib/algolia-instant-search/instantsearch.min.css}">
    <script type="text/javascript" th:src="@{/blog/lib/algolia-instant-search/instantsearch.min.js}"></script>
    <script>
        var href = location.href;
        var id = href.substring(href.lastIndexOf("/") + 1,href.length);
        if (id == "") {
            id = "index";
        }
        var ids = ["index","categories","archives","tags","about"];
        for (var i = 0; i < ids.length; i++) {
            if (id == ids[i]) {
                $("#" + id).addClass("menu-item-active");
            } else {
                $("#" + ids[i]).removeClass("menu-item-active");
            }
        }

        function commentClick() {
            var content = $("#comment-content").val();
            var author = $("#nickname").val();
            var email = $("#email").val();
            var url = $("#url").val();
            var coid = $("#coid").val();
            var cid = $("#cid").val();
            var csrf_token = $("#csrf_token").val();

            if (null == content || "" == content || undefined == content) {
                alert("内容不能为空");
                return false;
            }
            if (null == author || "" == author || undefined == author) {
                alert("姓名不能为空");
                return false;
            }
            if (null == email || "" == email || undefined == email) {
                alert("邮箱不能为空");
                return false;
            }

            var data = {
                "content": content,
                "author":author,
                "email": email,
                "url": url,
                "csrf_token": csrf_token,
                "coid": coid,
                "cid": cid
            };

            console.log(data);
            $.ajax({
                type: 'post',
                url: '/comment',
                data: data,
                async: false,
                dataType: 'json',
                success: function (result) {
                    // $('#comment-form input[name=coid]').val('');
                    if (result && result.code == 'success') {
                        alert("评论已提交至后台审核!");
                        window.location.reload();
                    } else {
                        if (result.msg) {
                            alert(result.msg);
                        }
                    }
                }
            });
        }
    </script>
</body>
</html>